<template>
	<!-- H5登录弹窗 -->
	<u-popup :show="showLogin" :round="30" mode="center" @close="close" @open="open">
		<view class="showLoginMask">
			<view class="title">参与发售活动</view>
			<view class="subTitle">请使用<text>“卯时数字平台”</text>已注册手机号登录</view>
			<view class="input">
				<view class="phone">
					<select>
						<option>+86</option>
						<option>+851</option>
					</select>
					<input type="number" v-model="mobile" placeholder-style="font-size:26rpx"
						placeholder="请输入手机号" />
					<button @click="getVerify()">{{!captchaTime?'获取验证码':captchaTime+'s'}}</button>
				</view>
				<view class="code">
					<text style="letter-spacing: 3rpx;">验证码</text>
					<input type="number" v-model="verifycode" placeholder-style="font-size:26rpx"
						placeholder="请输入验证码" />
				</view>
			</view>
			<view class="submit_btn" @click="submit">
				<button>登录</button>
			</view>
			<view class="register" @click="Register()"
				style="width: 30%;text-align: center;font-size:24rpx;color:#999999;margin:30rpx auto">
				<text></text>注册
			</view>
			<view class="agree_read">
				<label class="radio">
				<radio-group @change="agreeRadio">
						<radio value="1"></radio>
				</radio-group>	
				</label>
				已阅读并同意<text @tap="userAgreement()">《用户协议》</text>和<text @tap="privacyAgreement()">《隐私保护指引》</text>
			</view>
		</view>
	</u-popup>
	<!-- 注册弹窗 -->
	<u-popup :show="showRegister" :round="30" mode="center" @close="close" @open="open">
		<view class="showRegisterMask">
			<view class="header_img" style="width: 333rpx;height: 333rpx;margin: auto;">
				<image style="width: 100%;height: 100%;" src="/static/qrcode.jpg"></image>
			</view>
			<view class="content_text">
				该手机号未注册，请搜索
				<text style="font-weight: bold;color:#333333">“卯时数字平台”</text>小程序或识别二维码后，进入‘我的’页面注册并完成实名认证。
			</view>
		</view>
	</u-popup>
</template>

<script>
	import api from '@/request/api.js'
	
	export default {
		data(){
			return{
				/* 登录 */
				mobile:'',
				verifycode:'',
				/* 弹窗 */
				showLogin: false,
				showRegister: false,
				src: 'http://publish.onedaen.com',
				captchaTime:0,//验证码倒计时
				agreeValue:'',//同意协议
			}
		},
		methods:{
			//登录
			Login() {
				this.showLogin = true
			},
			submit() {
				if(!this.agreeValue){
					uni.showToast({
						title: '请先勾选！',
						icon: 'error'
					})
				}else{
				if(!this.verifycode){
					uni.showToast({
						title: '验证码不能为空',
						icon: 'none'
					})
				}else{
					api.submitLogin({
						'mobile': this.mobile,
						'code': this.verifycode
					}).then(res => {
						console.log(res)
						if(res.code==false){
							uni.showToast({
								title:'登录失败，请重试！',
								icon:'error'
							})
						}else{
							this.showLogin=false
							uni.showToast({
								title:'登录成功！',
							})
							this.hasLogin=true
							uni.setStorage({
								key: 'userInfo',
								data: {
									'nickName': res.data.nickname,
									'avatarUrl': res.data.avatar,
									'token': res.data.token,
									'is_auth': res.data.is_auth,
									'uid': res.data.uid,
									'mobile': res.data.mobile,
									'update_time': res.data.update_time,
									'nft_address': res.data.nft_address
								},
								complete: (res) => {
									console.log(res)
								}
							});
						}
					})
				}
				}
			},
			// 注册
			Register() {
				this.showLogin = false
				this.showRegister = true
			},
			getVerify() {
				/* 手机号验证 */
				let reg = /^[1][3,4,5,7,8,9][0-9]{9}$/
				if (!this.mobile) { //判断如果手机号为空，提示用户输入手机号
					uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					})
					return
				} else if (!reg.test(this.mobile)) { //判断手机号格式时候正确
					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					})
					return
				}else{
					// 获取验证码
					api.getVerifyCode({
						'mobile': this.mobile
					}).then(res => {
						console.log(res)
						if(res.code==true){
							this.captchaCountdown()
						}else{
							this.captchaCountdown()
						}
					}).catch(err => {
						console.log(err)
					})
				}
				
			},
			//验证码倒计时
			captchaCountdown(){
				console.log(555)
				if(this.captchaTime > 0){
					uni.showToast({
						title:'不能重复获取',
						icon:'none'
					})
					return ;
				}else {
					this.captchaTime = 60;
					 let timer = setInterval(()=>{
					 this.captchaTime--;
					 console.log(this.captchaTime)
					 if(this.captchaTime < 1){
						 clearInterval(timer);
						 this.captchaTime = 0
					 }
					 },1000)
				}
			},
			
			//实名
			Verify() {
				uni.navigateTo({
					url: '/pages/verify/verify'
				})
			},
			// radio选中
			agreeRadio(e){
				console.log(e)
				this.agreeValue=e.detail.value
			},
		}
	}
</script>

<style>
</style>